﻿<%@ Page Title="" Language="C#" MasterPageFile="~/W_View/PageMaster.Master" AutoEventWireup="true" CodeBehind="B_HistoryPage.aspx.cs" Inherits="STHPMS1.Web.W_View.Basis.B_HistoryPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <%= UiHelper.RefJsFileHtml("/Scripts/Control/datagrid.js")%>
     <%= UiHelper.RefJsFileHtml("/Scripts/Control/dropdown.js")%>
    <%= UiHelper.RefJsFileHtml("/Scripts/TypeScript/Enum.js")%>
    <%= UiHelper.RefJsFileHtml("/Scripts/TypeScript/JsPage.js")%>
    <%= UiHelper.RefJsFileHtml("/Scripts/TypeScript/Appearance.js")%>
    <script>
        var _css = new Appearance();


        var option=''
        function showAdd() {
            //初始化养护类型下拉框
            if (option=='') {
                $.ajax({
                    url: "/api/data/maintype",
                    async: false,
                    type: "get",
                    dataType: "json",
                    success: function (msg) {
                        var data = eval(msg);
                        $(data).each(function () {
                            if (this.id != 12000) {
                                option += "<option value='" + this.id + "'>" + this.text + "</option>";
                            }
                        });
                    },

                    error: function (msg) {
                        //错误处理
                        $.messager.alert('错误提示', msg.responseText, "error");
                    }
                });
            }
            $("#cmbYH").empty().append(option);
            //动态设置添加行按钮的绑定事件
            $("#addRow").unbind("click").bind("click", function () { addTrYH1(); });

            $('#dlg').dialog('open');
        }

        ////////添加一行、删除一行封装方法///////
        /**
         * 为table指定行添加一行
         *
         * tab 表id
         * row 行数，如：0->第一行 1->第二行 -2->倒数第二行 -1->最后一行
         * trHtml 添加行的html代码
         *
         */
        function addTr(tab, row, trHtml) {
            //获取table最后一行 $("#tab tr:last")
            //获取table第一行 $("#tab tr").eq(0)
            //获取table倒数第二行 $("#tab tr").eq(-2)
            var $tr = $("#" + tab + " tr").eq(row);
            if ($tr.size() == 0) {
                alert("指定的table id或行数不存在！");
                return;
            }
            $tr.after(trHtml);
        }

        function delTr(ckb) {
            //获取选中的复选框，然后循环遍历删除
            var ckbs = $("input[name=" + ckb + "]:checked");
            if (ckbs.size() == 0) {
                alert("要删除指定行，需选中要删除的行！");
                return;
            }
            ckbs.each(function () {
                $(this).parent().parent().remove();
            });
            $("#allCkb").removeAttr("checked");
        }

        /**
         * 全选
         * 
         * allCkb 全选复选框的id
         * items 复选框的name
         */
        function allCheck(allCkb, items) {
            $("#" + allCkb).click(function () {
                $('[name=' + items + ']:checkbox').attr("checked", this.checked);
            });
        }

        ////////添加一行、删除一行测试方法///////
        $(function () {
            //全选
            allCheck("allCkb", "ckb");
        });

        //预防性类型添加行按钮
        var optionLayer = '';
        function addTrYH1() {
            if($("#tab tr").length==2)return;  //预防性养护只允许添加一行
            //层位
            if (optionLayer == '') {
                $.ajax({
                    url: "/api/data/layer2",
                    async: false,
                    type: "get",
                    dataType: "json",
                    success: function (msg) {
                        var data = eval(msg);
                        $(data).each(function () {
                            if (this.id < 95) {
                                optionLayer += "<option value='" + this.id + "'>" + this.text + "</option>";
                            }
                        });
                    },

                    error: function (msg) {
                        //错误处理
                        $.messager.alert('错误提示', msg.responseText, "error");
                    }
                });
            }
            var c1 = "<select style='width:100px;' onchange='changeLayer(this)' >" + optionLayer + "</select>"
            var c2 = "<input type='text' style='width:50px;' >"
            var c3 = "<input type='text' style='width:50px;'>"
            var c4 =  "<select style='width:100px;'><option>稀浆封层</option><option>微表处</option><option>碎石封层</option><option>复合封层</option><option>薄层罩面</option><option>雾封层</option><option>沥青热再生</option><option>雷诺锋</option><option>纤维沥青碎石封层</option><option>含砂雾封层</option><option>开普封层</option><option>沥青还原剂</option></select>"
  
            var trHtml = "<tr align='center'><td ><input type='checkbox' name='ckb'/></td><td >" + c1 + "</td><td >" + c2 + "</td><td >" + c3 + "</td><td >" + c4 + "</td></tr>";
            addTr("tab", -1, trHtml);

            //设置默认属性
                $("#tab tr:last").children().eq(1).children().attr("disabled", "disabled");//层位
                $("#tab tr:last").children().eq(2).children().attr("disabled", "disabled");//铣刨厚度

        }

        //其他养护类型按钮
        function addTrYH2() {
            if (optionLayer == '') {
                //层位
                $.ajax({
                    url: "/api/data/layer2",
                    async: false,
                    type: "get",
                    dataType: "json",
                    success: function (msg) {
                        var data = eval(msg);
                        $(data).each(function () {
                            if (this.id < 95) {
                                optionLayer += "<option value='" + this.id + "'>" + this.text + "</option>";
                            }
                        });
                    },

                    error: function (msg) {
                        //错误处理
                        $.messager.alert('错误提示', msg.responseText, "error");
                    }
                });
            }
            var c1 = "<select style='width:100px;' onchange='changeLayer(this)' >" + optionLayer + "</select>"
            var c2 = "<input type='text' style='width:50px;' >"
            var c3 = "<input type='text' style='width:50px;'>"
            var c4 =  "<select style='width:100px;'><option>请选择</option><option>AC-5</option><option>AC-10</option><option>AC-13</option><option>AC-16</option><option>改性AC-10</option><option>改性AC-13</option><option>改性AC-16</option><option>sup-13</option><option>SMA-13</option><option>SMA-16</option><option>OGFC-13</option><option>OGFC-16</option><option>AM-16</option><option>AM-20</option><option>AM-25</option><option>AM-35</option><option>ARAC-13</option><option>ARAC-20</option><option>ARAC-25</option><option>沥青贯入式</option><option>沥青表处</option><option>水泥混凝土板</option></select>"
            var trHtml = "<tr align='center'><td ><input type='checkbox' name='ckb'/></td><td >" + c1 + "</td><td >" + c2 + "</td><td >" + c3 + "</td><td >" + c4 + "</td></tr>";
            addTr("tab", -1, trHtml);
        }

        function delTr2() {
            delTr('ckb');
        }

        function clearAllRow()
        {
            var ckbs = $("input[name='ckb']");
            ckbs.each(function () {
                $(this).parent().parent().remove();
            });
            $("#allCkb").removeAttr("checked");
        }

        function clear()
        {
            clearAllRow();           
            $("#Beginmp").textbox("setValue", "");
            $("#Endmp").textbox("setValue", "");
        }

        //养护类型改变
        function changeYH(obj)
        {
            var v =$(obj).val(); //养护类型
           
            var optionText = "";
            if(v=="12001")
            {
                //删除表格所有行
                clearAllRow();
                //动态事件
                $("#addRow").unbind("click").bind("click", function () { addTrYH1(); });
            }
            else
            {               
                //删除表格最后一行
                if($("#tab tr").length==2){  $("#tab tr:last").remove();}
                $("#addRow").unbind("click").bind("click", function () { addTrYH2(); });
            }
        }
        //层位改变
        function changeLayer(obj)
        {
            var v = obj.options[obj.options.selectedIndex].value; //层位值
            var s = $(obj).parents("tr").children().eq(4).children();//材料下拉框 
            s.empty();
            if (v == "30")
                s.append("<option>请选择</option><option>AC-5</option><option>AC-10</option><option>AC-13</option><option>AC-16</option><option>改性AC-10</option><option>改性AC-13</option><option>改性AC-16</option><option>sup-13</option><option>SMA-13</option><option>SMA-16</option><option>OGFC-13</option><option>OGFC-16</option><option>AM-16</option><option>AM-20</option><option>AM-25</option><option>AM-35</option><option>ARAC-13</option><option>ARAC-20</option><option>ARAC-25</option><option>沥青贯入式</option><option>沥青表处</option><option>普通混凝土板</option>");
            else if(v=="45")
            {
                s.append("<option>请选择</option><option>AC-13</option><option>AC-16</option><option>AC-20</option><option>改性AC-13</option><option>改性AC-16</option><option>改性AC-20</option><option>sup-19</option><option>sup-25</option><option>AM-16</option><option>AM-20</option><option>AM-25</option><option>AM-35</option><option>普通混凝土板</option>");
            }
            else if (v == "50") {
                s.append("<option>请选择AC-16</option><option>AC-20</option><option>AC-25</option><option>sup-25</option><option>改性AC-16</option><option>改性AC-20</option><option>改性AC-25</option><option>AM-16</option><option>AM-20</option><option>AM-25</option><option>AM-35</option><option>ATPB-25</option><option>ATPB-30</option><option>ATB-25</option><option>ATP-30</option><option>ATP-35</option><option>ATB-25</option><option>ATB-30</option><option>ATB-35</option><option>LSM-30</option><option>LSM-35</option>");
            }
            else if (v == "55") {
                s.append("<option>请选择</option><option>水泥稳定碎石</option><option>水泥稳定砂砾</option><option>水泥稳定土</option><option>石灰稳定碎石</option><option>石灰稳定砂砾</option><option>石灰土</option><option>二灰碎石</option><option>二灰砂砾</option><option>二灰土</option><option>石灰工业废渣稳定碎石</option><option>石灰工业废渣稳定砂砾</option><option>石灰工业废渣稳定土</option><option>ATPB-25</option><option>ATPB-30</option><option>ATB-25</option><option>ATB-30</option><option>ATB-35</option><option>LSM-30</option><option>LSM-35</option><option>AM-16</option><option>AM-20</option><option>AM-25</option><option>AM-35</option><option>级配砾石</option><option>级配碎石</option><option>天然砂砾</option><option>级配碎砾石</option><option>泥结碎石</option><option>泥灰结碎石</option><option>填隙碎石</option><option>贫混凝土</option>");
            }
            else if (v == "75") {
                s.append("<option>请选择</option><option>水泥稳定碎石</option><option>水泥稳定砂砾</option><option>水泥稳定土</option><option>石灰稳定碎石</option><option>石灰稳定砂砾</option><option>石灰土</option><option>二灰碎石</option><option>二灰砂砾</option><option>二灰土</option><option>石灰工业废渣稳定碎石</option><option>石灰工业废渣稳定砂砾</option><option>石灰工业废渣稳定土</option><option>ATPB-25</option><option>ATPB-30</option><option>ATB-25</option><option>ATB-30</option><option>LSM-30</option><option>LSM-35</option><option>AM-16</option><option>AM-20</option><option>AM-25</option><option>LSM-30</option><option>LSM-35</option><option>级配砾石</option><option>级配碎石</option><option>天然砂砾</option><option>级配碎砾石</option><option>泥结碎石</option><option>泥灰结碎石</option><option>填隙碎石</option><option>贫混凝土</option>");
            }
        }
    </script>

    <script>
        function add()
        {
            var rdid = $("#cmbRoadway").combobox("getValue")//路线编号            
            var dir = $("#cmbDirection").combobox("getValue")//行车方向
            var year = $("#year").combobox("getText");//养护年份
            var start = $("#Beginmp").textbox("getValue");//起点桩号
            var end = $("#Endmp").textbox("getValue");//结束桩号
            var yh = $("#cmbYH").val();//养护类型
            var v = '';
            //遍历table
            $('#tab tr').each(function (index,item) {
                if(index>0)
                {
                    var LAYER_DICTID = $(item).children().eq(1).children().val();//层位
                    var xpThick = $(item).children().eq(2).children().val();//铣刨厚度
                    var jpThick = $(item).children().eq(3).children().val();//加铺厚度
                    var jpCl = $(item).children().eq(4).children().find("option:selected").text();//加铺材料
                    xpThick = xpThick == '' ? '0' : '-' + xpThick;
                    jpThick = jpThick == '' ? '0' : jpThick;
                    v += LAYER_DICTID + '*' + xpThick + '*' + jpThick + '*' + jpCl  + '|'
                }
            });
            $.ajax({
                url: "/api/history/save?rdid=" + rdid + "&dir=" + dir + "&year=" + year + "&start=" + start + "&end=" + end + "&v=" + v+"&yh="+yh,
                type: "post",
                success: function (msg) {
                    $('#dlg').dialog('close');
                    search(null, null);
                    clear();
                    $.messager.confirm("操作提示", "添加成功，是否根据养护历史更新基础路段？", function (data) {
                        if (data) {
                            Update(rdid, dir, start, end, v, yh);
                        }
                       
                    });
                },

                error: function (msg) {
                    //错误处理
                    alert(msg.responseText);
                }
            });
        }

        function Update(rdid,dir,start,end,v,yh)
        {
            $.ajax({
                url: "/api/history/update?rdid=" + rdid + "&dir=" + dir + "&year=" + year + "&start=" + start + "&end=" + end + "&v=" + v + "&yh=" + yh,
                type: "post",
                success: function (msg) {
                    alert("更新成功");
                },

                error: function (msg) {
                    //错误处理
                    alert(msg.responseText);
                }
            });
        }

    </script>

    <script>
        function search(n, o) {
            var url = '/api/history';
            $('#dg').datagrid({ url: url, pageNumber: 1 });
        }
        $(function () {
            var number = '<%= Page.RouteData.Values["page"] %>';
            var size = '<%= Page.RouteData.Values["size"] %>';

            dataGridBind($('#dg'), '/api/history', '养护历史列表显示', $('#tb'), number, size);

            $('.validatebox-text').bind('blur', function () {
                $(this).validatebox('enableValidation').validatebox('validate');
            });
        })

        function showLayer()
        {
            var row = $('#dg').datagrid('getSelected');
            if (!row) {
                $.messager.alert('消息提示', '请选择一项!', 'warning');
                return;
            }
            var id = row.Detailsid;
            var url = '/api/history/details?';           
            var urlParam = "";
            if (id != "") urlParam += "id=" + id;
            url = url + urlParam;
            var number = '<%= Page.RouteData.Values["page"] %>';
            var size = '<%= Page.RouteData.Values["size"] %>';

            dataGridBind($('#dgLayer'), url, '养护明细列表显示', null, number, size);
        }

    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <table id="dg" class="easyui-datagrid content-place" ajaxcached="false">
        <thead>
            <tr>
                <th data-options="field:'Detailsid',width:180,hidden:true">编号</th>
                <th data-options="field:'Rdwayid',width:180">路线编号</th>
                <th data-options="field:'Direction_Dictid',width:120,formatter:formatEnum">方向</th>
                <th data-options="field:'Beginmp',width:120,formatter:formatPile">起点桩号</th>
                <th data-options="field:'Endmp',width:120,formatter:formatPile">终点桩号</th>
                <th data-options="field:'Pave_Type',width:120,formatter:formatMainType">养护类型</th>
                <th data-options="field:'Year',width:120">养护年份</th>
            </tr>
        </thead>
    </table>
    <!--表格数据操作-->
    <div id="tb">
        <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick="showAdd()">添加</a>

        <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick="showLayer()">养护详情</a>
    </div>

<!--养护详情-->
    <p></p>
    <table id="dgLayer" class="easyui-datagrid content-place" ajaxcached="false">
        <thead>
            <tr>
                 <th data-options="field:'History_LayerId',width:180">原始编号</th>
                <th data-options="field:'Layer_Dictid',width:180,formatter:formatLayer">层位</th>
                <th data-options="field:'MillingThick',width:180">铣刨厚度(cm)</th>
                <th data-options="field:'OverLayThick',width:120">加铺厚度(cm)</th>
                <th data-options="field:'Stru_Id',width:120">加铺材料</th>
            </tr>
        </thead>
    </table>

    <!--添加养护历史-->
    <div id="dlg" class="easyui-dialog" title="添加养护历史" style="width: 700px; height: 400px; padding: 10px" closed="true" data-options="
				iconCls: 'icon-save',
				buttons: '#dlg-buttons'">
        <table>
            <tr>
                <td>路线名称</td>
                <td>
                    <select id="cmbRoadway" class="easyui-combobox" panelheight="80" style="width: 100px; font-size:20px"
            data-options="url:'/api/history/searchRoad',method:'get',valueField:'Rdwayid',textField:'Name',
                            onLoadSuccess:function(data){ $('#cmbRoadway').combobox('setValue',data[0].Rdwayid);}">
                        </td>
            </tr>
            <tr>
                <td>行车方向</td>
                <td>
                    <select id="cmbDirection" class="easyui-combobox" panelheight="80" style="width: 100px"
        data-options="url:'/api/data/direction',method:'get',valueField:'id',textField:'text',
                              onLoadSuccess:function(data){ $('#cmbDirection').combobox('setValue',data[0].id);}">
    </select>
                </td>
            </tr>
             <tr>
                <td>路面养护类型</td>
                <td>
                    <select id="cmbYH" panelheight="80" style="width: 100px" onchange="changeYH(this)" >      
    </select>
                </td>
            </tr>
            <tr>
                <td>养护年份</td>
                <td>
                     <select id="year" class="easyui-combobox" panelheight="80" style="width: 100px">
                            <option selected="selected">2015</option>
                            <%for (int i = 2015; i < 2025; i++)
                              { %>
                            <option><%=i%></option>
                            <%} %>
                        </select>
                </td>
            </tr>
            <tr>
                    <td>起点桩号:</td>
                    <td><input id="Beginmp" name='Beginmp' class='easyui-numberbox' data-options="required:true,min:0,precision:2,formatter:_css.formatStake,parser:_css.parserStake" /></td>
                </tr>
                <tr>
                    <td>终点桩号:</td>
                    <td><input id="Endmp" name='Endmp' class='easyui-numberbox' data-options="required:true,min:0,precision:2,formatter:_css.formatStake,parser:_css.parserStake" /></td>
                </tr>
            <tr>
                <td>养护层</td>
                <td>
                    <table id="tab" style="width:500px;">
                        <tr align="center">
                            <td>
                                <input id="allCkb" type="checkbox" /></td>
                            <td>层位</td>
                            <td>铣刨厚度(cm)</td>
                            <td>加铺厚度(cm)</td>
                            <td>加铺材料</td>
                        </tr>

                    </table>
                    <a id="addRow"  style="cursor:pointer" >添加</a>
                    <a id="delRow" onclick="delTr2()" style="cursor:pointer">删除</a>
                </td>
            </tr>
        </table>
    </div>
    <!--编辑数据命令-->
    <div id="dlg-buttons">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:add()">保存</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:$('#dlg').dialog('close')">取消</a>

    </div>
</asp:Content>
